<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <button id="reset">重新开始一局游戏</button><br/>
    请输入要猜的数字：<input type="text" id="userGuess">
    <button id="guess">猜</button><br/>
    已经猜的次数：<span id="count"></span><br/>
    结果：<span id="result"></span>

    <script src="js/jquery.min.js"></script>
    <script>
        // 随机数生成0-1  乘100后即0-100
        var number = Math.floor(Math.random()*100) + 1;
        console.log("number: "+number);
        var count = 0;
        // $加上括号,意指选中该标签,可以是id选中也可以是val选中,但是前面的符号不同
        $("#guess").click(function(){
            count ++;
            $("#count").text(count);
            var userGuess = $("#userGuess").val;
            if(userGuess > number){
                $("#result").text("猜大了");
                $("#result").css("color","red");
            }
            else if(userGuess < number){
                $("#result").text("猜小了");
                $("#result").css("color","red");
            }
            else if(userGuess = number){
                $("#result").text("猜对了");
                $("#result").css("color","green");
            }
        });
        $("#reset").click(function(){
            number = Math.floor(Math.random()*100) + 1;
            console.log("number"+number);
            count = 0;
            $("#count").text("");
            $("#result").text("")
        });
    </script>
</body>
</html>